<template>
    <div>
        <h2>公告列表</h2>
        <table>
            <tr>
                <td>
                       标题:<input type="text">
                       分类:<select>
                            <option value="">请选择</option>
                            <option>早餐早点</option>
                            <option>饮料</option>
                       </select>
                    <button @click="chaxun">查询</button>
                    <button @click="pidel">批量删除</button>
                   
                </td>
            </tr>
        </table>
        <table class="table table-bordered">
            <tbody>
                <tr class="bg bg-primary">
                    <td><input type="checkbox"></td>
                    <td>id</td>
                    <td>门店</td>
                    <td>地址</td>
                    <td>图片</td>
                    <td>范围</td>
                    <td>店主</td>
                    <td>联系电话</td>
                    <td>介绍</td>
                    <td>状态</td>
                    <td>操作</td>
                </tr>
                <tr v-for="item in showgong">
                    <td><input type="checkbox"></td>
                    <td>{{item.id}}</td>
                    <td>{{item.biaoti}}</td>
                    <td>{{item.leixing}}</td>
                    <td>{{item.tupian}}</td>
                    <td>{{item.zhuangtai}}</td>
                    <td>{{item.stime}}</td>
                    <td>{{item.faburen}}</td>
                    <td>
                        <button @click="(item.id)">删除</button>
                        <button @click="(item.id)">修改</button>
                    </td>
                </tr>
                <tr >
                    <td><input type="checkbox"></td>
                    <td>3</td>
                    <td>老八的店</td>
                    <td>老八家</td>
                    <td><img src="/src/img/【玲纱】2024-08-26 15_17_20.png" width="100px"></td>
                    <td>饮料</td>
                    <td>老八</td>
                    <td>12345678988</td>
                    <td>无</td>
                    <td>启用</td>
                    <td>
                        <button @click="zhuangtai">修改状态</button>
                        <button @click="Del">删除</button>
                        <button @click="Update">修改</button>
                    </td>
                </tr>

                <tr >
                    <td><input type="checkbox"></td>
                    <td>4</td>
                    <td>老九的店</td>
                    <td>老九家</td>
                    <td><img src="/src/img/【粉色星球】2024-08-08 15_39_25.png" width="100px"></td>
                    <td>饮料</td>
                    <td>老九</td>
                    
                    <td>12345678999</td>
                    <td>无</td>
                    <td>启用</td>
                    <td>
                        <button @click="zhuangtai">修改状态</button>
                        <button @click="Del">删除</button>
                        <button @click="Update">修改</button>
                    </td>
                </tr>

            </tbody>
        </table>
        <table>
            <tr>
                <td>
                    <a @click="show('a')" href="showmen">上一页</a>
                    <a @click="show('b')" href="shewmen">下一页</a>
                    <a   @click="show('e')" href="showmen">1</a>
                    <a   @click="show('f')" href="shewmen">2</a>
                    <a @click="show('c')" href="showmen">首页</a>
                    <a @click="show('d')" href="shewmen">尾页</a>
                  
                    共1页，当前1/1页，共2条

                    每页
                    <select>
                        <option>2</option>
                        <option>1</option>
                        <option>5</option>
                    </select>
                    条
                </td>
            </tr>
        </table>
    </div>
</template>

<script setup lang="ts">
import axios from 'axios';
import { onMounted, reactive, ref, toRefs } from 'vue';
import { useRouter } from 'vue-router';
import "bootstrap/dist/css/bootstrap.min.css"
import { hrtime } from 'process';
const router=useRouter();

const showgong=ref();
const form=reactive({
    start:{
        biaoti:"",
        leixing:"",
        index:1,
        size:2
    },
    list:[],
    count:0,
    sum:0
})
const {start,list,count,sum}=toRefs(form);

const getshow=()=>{
    let obj={
        biaoti:start.value.biaoti,
        leixing:start.value.leixing,
        index:start.value.index,
        size:start.value.size,
    }

}

const Del=()=>{
    if(confirm("确定删除吗")){
        alert("删除成功");
        router.push("shomgong")
    }
}


const Update=()=>{
    router.push("upmen");
}

const chaxun=()=>{
    router.push("shommen");
}


onMounted(res=>{
    getshow();
})

</script>

<style scoped>

</style>